<script lang="tsx">
import { computed } from 'vue'
import { useRoute } from 'vue-router'
export default {
  setup(_, { slots, attrs }) {
    const route = useRoute()

    const auths = computed(() => {
      const auths: string[] = route?.meta.auths as string[] || []
      return new Set(auths)
    })

    return () => {
      const btns = slots.default ? slots.default({ auths: auths.value, ...attrs }) : null
      return (
        <div className="auth-button-group">
          { btns }
        </div>
      )
    }
  }
}
</script>
